<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>如果你在 border-radius 属性中只指定一个值，那么将生成 4 个 圆角。但是，如果你要在四个角上一一指定</title>
    <style>
        #rcorners4 {
            border-radius: 15px 50px 30px 5px;
            background: #8AC007;
            padding: 20px;
            width: 200px;
            height: 150px;
        }

        #rcorners5 {
            border-radius: 15px 50px 30px;
            background: #8AC007;
            padding: 20px;
            width: 200px;
            height: 150px;
        }

        #rcorners6 {
            border-radius: 15px 50px;
            background: #8AC007;
            padding: 20px;
            width: 200px;
            height: 150px;
        }
    </style>
</head>

<body>

    <p>四个值 - border-radius: 15px 50px 30px 5px:</p>
    <p id="rcorners4"></p>

    <p>三个值 - border-radius: 15px 50px 30px:</p>
    <p id="rcorners5"></p>

    <p>两个值 - border-radius: 15px 50px:</p>
    <p id="rcorners6"></p>

</body>

</html>